<template>
	<view class="bg-white">
		

		
		<view class="padding bg-white">
			<view class="cu-form-group">
				<text>待移代理</text>
				<u-picker :show="show" :columns="level_user" @confirm="confirm" keyName="username" @cancel="closeShow" :closeOnClickOverlay="true" @close="closeShow"></u-picker>
				<u-button @click="show = true"  @confirm="confirm">{{dlname}}</u-button>
			</view>
			<view class="cu-form-group">
				<text>转移数量</text>
				<input class="text-right" v-model="num" :placeholder="'转移数量不可大于'+total+'个'" name="input"></input>
			</view>
			
			<view >
				<u-button @click="submit()" type="primary" size="big" text="大小尺寸">确认转移二维码</u-button>
			</view>
		</view>
		
		
		
		<view class="padding bg-gray">
			<text>共计：{{total}}个</text>
		</view>
		
		<u-list @scrolltolower="scrolltolower" v-if="indexList.length>0">
			<u-list-item v-for="(item, index) in indexList" :key="index">
				<u-cell :title="item.imgid">
					<u-avatar
						slot="icon"
						shape="square"
						size="20"
						:src="item.qrcodeurl"
						customStyle="margin: -3px 5px -3px 0"
					></u-avatar>
				</u-cell>
			</u-list-item>
		</u-list>
		<view class="" v-else>
			<u-empty mode="list" icon="http://cdn.uviewui.com/uview/empty/order.png"></u-empty>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				list : [],
				indexList: [],
				level_user:[
					[],
				],
				total:0,
				params:{
					'page':1,
					'size':20
				},
				index: 0,
				show: false,
				dlid:null,
				dlname:'请选择待转移代理商',
				dlmobile:null,
				num:null
			}
		},
		onLoad() {
			this.loadmore()
		},
		methods: {
			// 返回页面
			onClickBack () {
				uni.navigateBack()
			},
			// 筛选日期
			onClickRight(){
				this.filterTimer = true
			},
			scrolltolower() {
				this.loadmore(this.page+1)
			},
			async loadmore() {
				const res = await this.$API({url: '/api/index/distributionagent',method:"GET", data:this.params})
				if (res.code === 1) {
					this.total =  res.data.total;
					
					for (let i = 0; i < res.data.list.length; i++) {
						this.indexList.push(res.data.list[i])
					}
					for (let item of res.data.level_user) {
						this.level_user[0].push(item)
					}
				} else {
					uni.showToast({
						icon: 'none',
						title: res.msg
					})
				}
			},
			confirm(e) {
				this.dlid = e.value[0]['id']
				this.dlname = e.value[0]['username']
				this.show = false
			},
			submit(){
				if (this.dlid===null){
					uni.showToast({
						icon: 'none',
						title: "请选择代理"
					})
				} else if (this.num<1){
					uni.showToast({
						icon: 'none',
						title: "请输入正确的转移数量"
					})
				} else {
					this.zhuanyi()
				}
			},
			async zhuanyi() {
				const res = await this.$API({url: '/api/index/distributionqrcode',method:"POST", data:{
					qrcodenum:this.num,
					p_id:this.dlid
				}})

				
				uni.showToast({
					title: res.msg,
					duration: 2000,
					success: (res)=> {
						setTimeout(()=>{
							uni.navigateTo({
								url:'/pages/my/codeList'
							});
						},1500)
					}
				});

			},
			closeShow () {
				this.show = false
			}
		}
	}
</script>

<style>
	.content {
		padding: 10rpx 20rpx;
		background: #F1F1F1;
		.addSalesman {
			border: 1px solid #1678ff;
			padding: 4rpx 30rpx;
			border-radius: 40rpx;
			font-size: 12px;
			color: #1678ff;
		}
	}
</style>
